<template>
  <div>
    <!-- 
      计算属性能不能使用v-model进行双向绑定
     -->
    全名：<input type="text" v-model="fullName" />
  </div>
</template>
<script>
export default {
  data() {
    return {
      name: "小明",
    };
  },
  computed: {
    // fullName() { //当用户修改名字的时候会报错，需用到计算属性的完整写法
    //   return "黄" + this.name;
    // },
    /**
     * 完整写法语法：
     * "属性名": {
     *  set(值){
     *    值：指的就是用户修改的内容
     *  },
     *  get(){
     *    return "值" // 这个值就是我们对计算属性设置的默认值
     *  }
     * }
     * 完整写法的使用场景：当需要对计算属性进行修改的时候才需要使用完整写法
     * */
    fullName: {
      set(val) {
        // 给计算属性赋值的时候触发
        console.log(35, val);
      },
      get() {
        // 调用计算属性的时候触发
        console.log("55555");
        return "黄" + this.name;
      },
    },
  },
};
</script>

<style>
</style>